<template>
  <div>
    <ul>
      <!-- 数组 -->
      <li v-for="(item, index) in arr">
        {{ item }} {{ index }}
        <input type="text" />
      </li>
    </ul>
    <button @click="reverse">新添加</button>
  </div>
</template>

<script>
// 目标：无key——如何更新DOM
// 尽可能的就地复用原有的标签结构
// 无key：从第二个往后从新内容（性能不高）




export default {

  data () {
    return {
      arr: ['姐姐', '妹妹', '弟弟', '哥哥'],


    }
  },
  methods: {
    reverse () {
      this.arr.splice(1, 0, '新来的')

    },


  }
}
</script>

<style>
</style>
